<template>
    <div>
		<Card v-for="(item,key) in data">
			<Row>
				<Col span="4">{{ item.title }}</Col>
				<Col span="6">更新日期：{{ new Date(parseInt(item.file.create_time)).toLocaleString() }}</Col>
				<Col span="14">
					<Button type="ghost" icon="ios-cloud-upload-outline" @click="detail(key)" v-if="checkPermission('113143')">更新文件</Button>
					<span>{{item.file.name}}</span>
				</Col>
			</Row>
		</Card>
      <Modal
			v-model="modal.is_show"
			title="请选择文件上传"
			@on-ok="ok"
			@on-cancel="cancel">
			<div style="margin-bottom:5px;font-size:20px;">{{current.title}}</div>
			<UploadedList v-model="current.list"  :format="['zip','exe','rar']" :number="1">上传</UploadedList>
      </Modal> 
    </div>
</template>

<script>
import UploadedList from "@/common/components/UploadedList";
import parent from "../Parent"
export default {
	extends:parent,
	data() {
		return {
			modal: {
				is_show: false
			},
			data: {
				google: { title: "谷歌浏览器", file: {}, list: [] },
				firefox: { title: "火狐浏览器", file: {}, list: [] },
				ie: { title: "IE浏览器", file: {}, list: [] }
			},
			current_key: "google"
		}
	},
	computed: {
		current() {
			return this.data[this.current_key];
		}
	},
	components: {
		UploadedList
	},
	methods: {
		parseData(data) { // 将服务器读取的数据解析成可用的数据
			var temp = this.data;
			for(var key in temp) {
				if(data[key]) {
					temp[key].file = JSON.parse(data[key].value);
					if(temp[key].file.id) temp[key].list = [temp[key].file];
				}
			}
		},
		detail(key) {
			this.current_key = key;
			this.modal.is_show = true;
		},
		ok() {
			this.current.file = this.current.list.length ? this.current.list[0] : {};
			var temp = {};
			temp[`browsers.${this.current_key}`] = JSON.stringify(this.current.file);
			this.api.post("free_value/set", { keyvalues: temp }, res => {
				this.$CustomMessage.success("修改成功！");
			});
		},
		cancel() {}
	},
	created() {
		this.api.post("free_value/get", { key: "browsers" }, res => {
			this.parseData(res.data || {});
		});
	}
}
</script>